/*
 * @Author: cygao
 * @Date: 2018-11-09 13:58:25
 * @Last Modified by: cygao
 * @Last Modified time: 2018-11-25 22:42:45
 * 趣事分享
 */

import React, { Component } from 'react';
import { connect } from "react-redux";
import {Link, withRouter} from 'react-router-dom';
import * as actions from '../../../../store/action/community';
import './fun.less'

class Fun extends Component {
    constructor () {
        super()
    }


    onLike(id){
        this.props.likeComment({
            cid: id
        })
       
    }

    render() {
        let data = this.props.list;
        let type = this.props.type;
        let arr = [];
        if(!Array.isArray(data)){
            arr.push(data);
            data = arr;
        }
        return (
            <div>
            {data.map((item, index) => {
            return <div className="fun-container clearfix">
                <Link to={"/funDetail/"+item.id}>
                    <div className="user">
                        <img className="avatar" src={ (item.first_comment || item).user.avatar }/>
                        <div className="user-info">
                            <p className="name">{ (item.first_comment || item).user.nickname }</p>
                            <p className="time">{ (item.first_comment || item).created_at }</p>
                        </div>
                        {/* <div className="share">
                            <i className="icon icon-share"></i>
                            <span>1512</span>
                        </div> */}
                    </div>
                    <div className="text">{ (item.first_comment || item).content }</div>
                    {(item.first_comment || item).images ?
                        <div className="imgs">
                            <img src={(item.first_comment || item).images[0]}/>
                        </div>
                    : ''}
                <div className="fun-info clearfix">
                    <span className="read-count">
                       {(item.first_comment || item).view_count}阅读
                    </span>
                    <div className="comment-like">
                        <i className="icon icon-comment"></i>
                        <span className="comment-count">{ (item.first_comment || item).reply_count }</span>
                        <i className="icon icon-like"></i>
                        <span className="like-count" onClick={this.onLike.bind(this, item.id)}>{ (item.first_comment || item).like_count }</span>
                    </div>
                </div>
                </Link> 
            </div>
            })}
            </div>
        )
    }
}

export default connect((state)=>{return {...state}}, actions)(Fun);
